<template>
    <Header style="background-color: #777777">
        <div class="userinfo">
            <img src="../assets/images/logo.png" v-if="headerImg" class="logo" alt="">
            <img :src="headerImg" v-if="headerImg" class="headImg" alt="">
            <span class="sp1">{{phone}}</span>
            <span class="sp2" @click="loginLog =true">退出登录</span>
            <span class="sp3" @click="setUserInfo()">修改信息</span>
        </div>
        <Modal
                v-model="loginLog"
                title="提示"
                @on-ok="ok"
                @on-cancel="cancel">
            确定退出登录?
        </Modal>
    </Header>
</template>
<script type="text/ecmascript-6">
    import Axios from 'axios';
    import ipServer from '../model/ip';
    import sessionUtils from '../model/sessionUtils';
    export default{
        data(){
            return {
                loginLog: false,
                phone: "13985462144",
                headerImg: "https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2535400800,3877224690&fm=26&gp=0.jpg"
            }
        },
        methods: {
            ok(){
                sessionUtils.clear();
                this.$router.push("/login");
            },
            cancel(){

            },
            setUserInfo(){
                this.$router.push("/updateUserInfo");
            }
        }, mounted(){
            this.phone = sessionUtils.getSession("mobile");
            this.headerImg = sessionUtils.getSession("headerImg");
        }

    }
</script>
<style scoped>
    @import "../assets/css/header.css";
</style>